<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // await相对于promise的then

        async function fn1() {
            return 100; // 相当于return Promise.resolve(100)
        }
        const res1 = fn1() // 执行 async 函数， 返回的是一个Promise对象
        console.log('res1', res1); // Promise {<resolved>: 100}
        // 所以这是个Promise对象

        res1.then(data => {
            console.log('data', data); // 100
        })

        // 若将返回的值设置为Promise对象会返回什么呢？
        // 依旧返回的是Promise对象
        async function fn2() {
            // return 100;
            return Promise.resolve(200)
        }
        const res2 = fn2() // 执行 async 函数， 返回的是一个Promise对象
        console.log('res2', res2); // Promise {<resolved>: 100}
        // 所以这是个Promise对象

        res2.then(data => {
            console.log('data', data); // 200
        });

        // 总结：async函数如果返回的是个值的话会封装成Promise对象，如果返回的是Promise对象那就不用转换。



        (async function () {
            const p1 = Promise.resolve(300);
            const data = await p1; // await 相当于 Promise的then
            console.log('data', data); // 300
        })();

        (async function () {
            const data1 = await 400;//  如果await后面跟的是数，而不是一个Promise，那么data是谁呢？
            // 其实这里相当于 await Promise.resolve(400) 封装成Promise的形式去执行Promise的then
            console.log('data1', data1); // 400
        })();

        // 因为await相当于Promise的then，而fn1返回的是Promise对象
        // 所以
        (async function () {
            const data2 = await fn1();
            console.log('data2', data2);
        })();


        // try...catch 可捕获异常，代替了 Promise 的 catch
        // try...catch 相当于Promise 的 catch
        (async function () {
            const p4 = Promise.reject('error1') // rejected状态
            // 通过try catch捕获错误
            try {
                const res = await p4;
                console.log(res);
            } catch (ex) {
                console.error(ex);// try...catch 相当于Promise 的 catch
                // err1
            }
        })();

        (async function () {
            const p4 = Promise.reject('error') // reject状态
            const res = await p4; // 本质是:await->then,因为reject状态,自然不会走then,只会走catch
            console.log(res);// 所以这里会报错不执行
        })();
    </script>
</body>

</html>